<%--
  Created by IntelliJ IDEA.
  User: pc
  Date: 2025/1/4
  Time: 15:33
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="zh-CN">
<head>
    <title>管理员主页</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/static/plugins/bootstrap-4.6.2-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/static/plugins/bootstrap-icons-1.11.3/font/bootstrap-icons.min.css">
    <style>
        /* 自定义样式 */
        .logo-text {
            text-align: left;
            font-weight: bold;
            color: green;
        }
        .icon-top-right {
            position: absolute;
            top: 0;
            right: 0;
        }
        .search-box {
            width: 50%;
        }
        .small-btn {
            padding: 0.25rem 0.5rem;
        }
        .large-avatar {
            width: 60px;
            height: 60px;
        }
        .nav-container {
            background-color: #f0f0f0; /* 使用十六进制颜色码设置浅灰色 */
            height: 100%; /* 使导航框的高度占满父元素 */
        }
    </style>
</head>
<body>
<div class="container-fluid h-100">
    <div class="row h-10 no-gutters">
        <div class="col-md-3 bg-light border-right border-dark position-relative">
            <div class="d-flex flex-column justify-content-center h-100 pl-3">
                <h1 class="logo-text mb-4">音有尽有</h1>
                <i class="bi bi-list fa-2x icon-top-right"></i>
            </div>
        </div>
        <div class="col-md-9">
            <div class="d-flex align-items-center h-100 justify-content-end">
<%--                <img src="<%=request.getContextPath()%>${sessionScope.profilePicture}" alt="头像" class="rounded-circle large-avatar" id="userAvatar">--%>
    <div class="nav-item dropdown">
    <img src="<%=request.getContextPath()%>${sessionScope.user.profilePicture}" alt="头像" class="rounded-circle large-avatar" id="userAvatar" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        <!-- 下拉菜单 -->
        <div class="dropdown-menu" aria-labelledby="userAvatar">
            <button class="btn btn-danger" onclick="logout()" >注销</button>
        </div>
    </div>
            </div>
        </div>
    </div>
    <div class="row h-90 no-gutters">
        <div class="col-md-3 nav-container text-white" style="height: 650px">
            <nav class="nav flex-column">
                <!-- home.jsp -->
                <a class="nav-link active" href="javascript:void(0);" onclick="changeIframeSrc('<%=request.getContextPath()%>/admin/userMng.jsp'); initializeUserList();">用户管理</a>

                <a class="nav-link" href="javascript:void(0);" onclick="changeIframeSrc('<%=request.getContextPath()%>/admin/musicMng.jsp');initializeSongList()">音乐管理</a>
            </nav>
        </div>
        <div class="col-md-9 bg-light">
            <iframe id="adminIframe" src="<%=request.getContextPath()%>/admin/userMng.jsp" width="100%" height="100%" frameborder="0"></iframe>
        </div>
    </div>
</div>

<script src="<%=request.getContextPath()%>/static/plugins/jquery/jquery.min.js"></script>
<script src="<%=request.getContextPath()%>/static/plugins/bootstrap-4.6.2-dist/js/bootstrap.bundle.js"></script>
<script src="<%=request.getContextPath()%>/static/js/util.js"></script>
<script src="<%=request.getContextPath()%>/static/js/admin/home.js"></script>
<script src="<%=request.getContextPath()%>/static/js/admin/userMng.js"></script>
<script src="<%=request.getContextPath()%>/static/js/admin/musicMng.js"></script>

<script>
    // 修改 iframe 的 src 属性
    function changeIframeSrc(url) {
        document.getElementById('adminIframe').src = url;
    }
</script>

</body>
</html>
